<template>
	<view>
		 <!-- 文本域 -->
		<textarea value =""  placeholder="说一句话吧"  v-model="list.content" class="uni-textarea px-2" />						
		<!-- 多图上传 -->
		<upload-image @chooose ="changeImage" v-model="list.imgList" @change="change"></upload-image>		
		<!-- 底部操作条 -->
	   <view class="fixed-bottom bg-white flex align-center " style="height: 85rpx;" >
	    	<view class="iconfont icon-fenlei footer-btn animated " hover-class="jello" ></view>
	    	<view class="iconfont icon-huati footer-btn animated" hover-class="jello" ></view>
	    	<view class="iconfont icon-tupian footer-btn animated" hover-class="jello" ></view>  
			<view class="bg-main text-white ml-auto flex justify-center align-center rounded mr-2 animated "
			style="width: 140rpx; height: 60rpx;" hover-class="jello" @click="Add">发送</view>		
	   </view>
	   
	</view>
</template>

<script>
	import uploadImage from '@/components/common/upload-image.vue'
	export default {
	 components:{
		 uploadImage
	 },
		data() {
			return {
			  list:{
				content:"",
				imgList:[]
			  }	
			}
		},
		methods: {
			//选中图片保存
			changeImage(e){
				
				console.log(e)
			    this.imageList = e
			},
			Add() {
					let data = this.list;
					// const db = uniCloud.database();
					// db.collection('list').add({
					// 	imgs:data.imgList,
					// 	content:data.content
					// });
					uniCloud.callFunction({
						name:'add',
						data:data				
				   })
			},
			change(msg){
				console.log('父组件收到的图片',msg)
				this.list.imgList.push(msg)
			}
		}
	}
</script>

<style>
   .footer-btn{
  	  width: 86rpx;
  	  height: 86rpx;
  	  display: flex;
  	  justify-content: center;
  	  align-content: center;
  	  font-size: 50rpx;
    }
</style>